//引入const更改
import { useState } from "react"
const Shuzujian =(props)=>{
    const [messageApi,contextHolder]=message.useMessage()
    const [form,setform]=useState({
        data:"",
        title:"",
        num:""
    })
    //日期
    const changedata =(e)=>{
        setform({
            ...form,
            data:e.target.value 
        })
    }
    //标题
    const changetitle =(e)=>{
        setform({
            ...form,
            title:e.target.value
        })
    }
    //优先级
    const changeum=(e)=>{
        setform({
            ...form,
            num:e.target.value
        })
    }
    //添加
    const addList=()=>{
        console.log(form )
        if(form.data===""||form.title===""||form.num===""){
            messageApi.open({
                type:"waening",
                content:"请输入内容"
            })
            return
        }
        let {data,title,num}=form
        props.todolist({data,title,num})
    }
    //页面渲染
    return(
        <>
          { contextHolder}
            <div className="TodoHeader">
                <div className="head">
                    <span>日期：</span>
                    <input type="text" className="input_data" onChange={changedata}/>
                    <span>标题：</span>
                    <input type="text" className="input_data" onChange={changetitle}/>
                    <span>优先级：</span>
                    <input type="text" className="input_data" onChange={changeum}/>
                </div>
                <div>
                    <button onClick={addList}>添加</button>
                </div>
            </div>
        </>
    )
}
export default Shuzujian